UXPin 


Agile UX in the Enterprise 
A Step-by-Step Survival Guide 


| 
i | 
a 


UXPin 


Agile UX in the Enterprise 
A Step-by-Step Survival Guide 


Copyright © 2015 by UXPin Inc. 


All rights reserved. No part of this publication text may be uploaded 
or posted online without the prior written permission of the publisher. 


For permission requests, write to the publisher, addressed “Attention: 
Permissions Request,” to hello@uxpin.com. 


Index 


Addressing the Challenges of Agile UX 


Research & Investigation 
1. Keep an open mind 


2. Product and UX should be partners 


Ideation and Backlog Refinement 

1. Include core team members in all discussions 
2. Don’t underestimate SEO requirements 

3. Sketch, Sketch, Sketch 


Design and Development 

1. Include the UX designers in the sprint planning 

2. Plan ahead for design needs 

3. Always prototype 

4. If UX resources are overwhelmed, go for “bare bones” design 


5. Include a front-end gatekeeper in the development team 


Testing & Validation 
1. Always make time for personal UX walkthroughs 


2. Don’t forget about Acceptance Testing 


Product Launch 
1. All feedback is valuable 


2. Keep personas and user journeys updated 


Takeaway 


With knowledge of the U.S, European and African markets, Ger- 
maine is a Product Manager who uses her 14 years of experience 
to help companies build products and services that resonate 
with users. Her varied skillset - Product Management, Writing, 
User Experience, Training, Quality Assurance - allows her to eval- 
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Addressing the 
Challenges of Agile UX 


UX must become the core of the product development process. It’s the 
only way for product teams to truly be self-organizing, collaborative 


and focused on customers. 


You must prioritize UX long before building the backlog and planning 


the sprints. Otherwise, you’ll run into the following issues: 


¢ Developers realize the enormity of the project and the impact on 
platform performance and architecture resulting from a specific 


functional requirement. 


¢ UX designers notice screens that may need to be completely over- 
hauled. 


¢ Developers notice that a specific functional need might require 


technical skills that the team doesn’t have. 


¢ Ifheaven forbid there is a hard marketing release date attached to 
the project — and let’s be real, there always is — then both parties 


panic about the lack of time to get any of it done. 


This means making time for UX testing during each sprint. This 
means taking a holistic approach to UX, with the understanding that 
everyone from Customer Support to Marketing & Growth can impact 


final user experience. 
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To understand how to achieve this in the real world, let’s dig into the 
five stages of every Agile product development life cycle and explain 


the UX implications at each stage. 


¢ Research & Investigation 

¢ Ideation and Backlog Refinement 
¢ Design and Development 

¢ Testing & Validation 


¢ Product Launch 


Research & Investigation 


The research and investigation phase is the most critical phase. It fo- 
cuses on information gathering and collecting answers to questions, 


such as (and this is not an exhaustive list): 

e Who is my target user? 

¢ What issues is my user facing? 

¢ How is my user currently managing those issues? 


¢ What tools and processes (manual or automated) is my user cur- 


rently using to manage the issues? 
¢ Js the user creating any custom workarounds to issues? 
¢ What sort of market/industry landscape am I facing? 


¢ Who are my competitors and how do they position themselves in 


the market? 
¢ What type of functionalities and UX do my competitors provide? 


¢ What is my competitor’s pricing model? 


¢ What are my business goals and objectives? 


¢ What will be my key differentiator(s)? 


A few things to keep in mind during this Research phase: 


1. Keep an open mind 


During this phase, the goal is to understand. You can then come up 
with potential solutions based on that understanding. Therefore, it is 
essential that the UX designer be part of this phase, so that they have 


a clear understanding of the problems they will be asked to solve. 
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Collaborative activities that ’ve found useful include stakeholder 
interviews, user interviews, user surveys, and heuristic analysis of 


competitors. 


While the UX designers can initiate these activities, you definitely 
want to share the results with the entire team. In fact, you’ll align to 


ideas much more efficiently if you invite developers and marketers to 
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user interviews. It’s definitely worth the extra coordination to arrive 


at a shared understanding of usability issues right in the beginning. 


2. Product and UX should be partners 


A few years ago I had the opportunity to visit customers in various 


European countries as part of this Research & Investigation phase. 


During these visits I traveled with a Senior UX Designer who ben- 
efitted immensely from being able to hear and see first-hand the 


frustrations customers were facing with our existing platform. 
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More importantly, the designer was able to ask customers questions 


that were more relevant to his work. For example: 


¢ What type of phone do you use — Android vs iPhone? Which ver- 
sion of the OS? 


¢ Which websites do you visit every day? 


¢ How much time do you typically spend on these sites? 


Understanding that the majority of users were on the most recent 
version of a specific phone or the regularly visited certain type of 
websites allowed the designer to understand the type of UX users 
were comfortable with. This information ultimately allowed us to 
enrich our user personas. And that, in turn, allowed us to implement 
a design that bridged the gap between the designer’s creative abilities, 
the user’s level of technological comfort, and the user’s need to work 


more efficiently on our platform. 


If you'd like to learn more about the early phases of research and 
how to properly document then, check out the free Guide to UX De- 


sign Process and Documentation. 


Ideation and 
Backlog Refinement 


Once the initial information gathering phase is complete and the 
problem is correctly understood, the team can start the ideation 
and backlog refinement phase. In this phase, there are sub-phases 


involving: 


e Solution ideation - This is generally high level and can be as ba- 
sic as deciding whether the solution will be a digital product ora 
service. Your team will discuss whether the solution is an entirely 


new product, feature updates, or perhaps even a new service. 


e Functional ideation - This discussion will focus on the high-level 
actions that users can take when interacting with the product. You'll 
also discuss the product form factor (e.g. whether the product will 


be web-based, mobile, or both). 


e Design and UI ideation - You’ll discuss the overall design vibe. 
For example, will the app be 100% gesture-driven? All possibili- 
ties can be explored before trying to close down on one singular 
solution. At this stage, nothing is off the table. You need to “think 


broad to get narrow”. 


e Marketing and Positioning ideation - This is an opportunity to 
figure out what makes the product, feature or service different. 
Understand the key talking points at this point and how the prod- 


uct addresses the target users. 
Here are a few things to keep in mind during the Ideation and Back- 
log Refinement phase: 
1. Include core team members in all discussions 
The previously mentioned sub-phases generally occur in parallel. As 


such, it’s important that core Agile team members, including the UX 


Designer, be part of these discussions. No part should be considered 


siloed as each one impacts the other. 
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If you’re using UXPin, for example, the business analyst or product 
manager might create a quick mockup or prototype to better illus- 
trate the requirements to designers. They can then tag specific team 
members for feedback and provide automatic notifications to stake- 


holders to follow along without getting lost in email chains. 


In the midst of feedback, however, remember to avoid design by 


committee. 


2. Don’t underestimate SEO requirements 


I was once part of a project that was already wrapping up development 


— until it became apparent that SEO requirements were overlooked. 


As a result, the language used in menu items, page headings, and 
more was re-evaluated and new SEO requirements were submitted. 
Some changes had no negative impact on existing design, but others 
had more significant impact. For example, some words exceeded the 
optimum character limits and broke the design layout. And in some 
other cases, we needed to add new blocks of content on some pages 
to account for SEO. Obviously, this last bit impacted the design the 


most. 


In the end, there was a lot of tough negotiations between the UX De- 
signer (who was trying to maintain a pristine UI) and the SEO spe- 
Clalist (who was trying to ensure that the products would be properly 


ranked by search engines). 
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The tough lesson learned here for all of us was that all future product 
releases needed to involve a clear understanding of SEO require- 
ments right from the start. And those needed to be scoped - or at least 
sketched out — at the conceptual phase for inclusion in the product 
backlog. By making this adjustment, future product releases led to 
better marketing and growth results because the SEO lead, brand 
team and product team worked together to accommodate each oth- 


er’s needs. 


Even better, consider the content-first design process to avoid these 
types of mistakes. Remember that content is the design. Don’t use 
Lorem Ipsum once you start progressing into higher fidelity design. 
Instead, add rough content into the interface or even content from a 
competitor site or app as soon as possible. In doing so, you dramat- 
ically reduce the risk of requiring an interface overhaul later in the 


design process. 


3. Sketch, Sketch, Sketch 


This Ideation and Backlog phase is the ideal moment for the UX 
team to produce basic mockups with Sharpie and paper that can be 
used to validate some of the main ideas that come from the ideation 
discussions. Alternatively, they can also use a tool such as UXPin, to 


whip up basic wireframe mockups. 
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When you’re sketching or working in lo-fidelity, it helps to hold 
quick design studio exercises to gather ideas from the product team 
and other stakeholders. In a nutshell: describe the design problem, 
encourage people to draw as roughly and quickly as possible, then 


present and decide on the best ideas. 


To learn more, designer Peiter Buick provides an excellent guide for 


mastering sketching. 


Design and Development 


After stakeholders align on the agreed solution and the backlog has 
been completed, the design and development phase of project kicks 
off. Once again, there will be a delicate balancing act here as the 
Product Manager works with designers, developers and internal 
stakeholders to ensure that requirements are met in Keeping with 


the expected product launch date. 


1. Include the UX designers in the sprint planning 


Each sprint planning session is an opportunity for all team members 
to dig into not just what should be done, but why. Getting everyone 


in the room at the same time is a huge time saver. 


In the same way that the product manager is often required to pro- 
vide more insight into functional requirements, so too should the UX 


designer provide insights into their design choices. 


In my experience, good developers will challenge the PM and UXer 


on their choices not for the sake of being difficult but to ensure that 


they are building the right product with the correct UX. 


2. Plan ahead for design needs 


Iteration is at the heart of Agile and designers also need to work iter- 


atively, ensuring that developers have designs ahead of each sprint. 


However, you may run into situations where full iteration isn’t a 
pragmatic solution and all screens must be designed prior to the 


start of the project. 


Tran into this situation as a Product Manager at a company that was 
transitioning to Agile. Key stakeholders had doubts about the efficacy 


of Agile for development cycles. 


Photo credit: “A List Apart big meeting, 30 January 2015.” Jeffrey Zeldman. Creative Commons. 


In particular, they were concerned that they would end up with 
fewer releases per year which would ultimately impact the revenue 
generated by sales teams. They also expressed concern about doing 
iterative design, worrying that a lack of fully designed screens from 
the get-go would lead to a worse design and UX. The development 
team, on the other hand, was very willing and eager to move forward 


with Agile methodology in every aspect. 


To address the needs of both parties, the designer and I agreed it 
would be best to provide “enriched” wireframes of all screens to 


stakeholders prior to the official project kickoff. 


Rather than doing simple black & white wireframes, we went a lit- 


tle further, inserting elements like colors and photos (derived from 


the brand identity) to various parts of the design, showing buttons 
and icons in various states (active vs inactive) and when necessary, 
making these mid-fidelity wireframes clickable at specific points to 


better demonstrate the user flows. 
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For some of you, wireframing may not sound groundbreaking. In fact, 
you may be thinking that wireframing all possible screens is very 
time-consuming. But for this particular context, the process proved 


to be far less work than creating full-scale mockups in Photoshop or 
Sketch. 


Photoshop was a much more time-consuming process, which meant 
that stakeholders had to wait longer before seeing screens to evalu- 
ate the concepts. Our interactive wireframing, however, meant that 


stakeholders could actually use something tangible within a day or two. 


The fast-paced approach also meant that the stakeholders, designer, 
and I could conduct our own “mini sprints” as we presented new 


wireframes and made adjustments as necessary on a daily basis. 


Working in this manner presented several clear benefits: 


¢ Developers received a more fleshed out view of the UI at the very 


start of the project. 


e There was very little need to go back and do the designs in Photo- 
shop. Since the wireframes were quite feature-complete, the de- 
signer mainly had to make notes for specific items that developers 


should pay attention to (such font size and font type). 


e¢ Sprint demo sessions (which stakeholders attended) were much 
shorter and much more pleasant for all because there were no 


surprises. Everyone left with a stronger feeling of accomplishment. 


As previously mentioned, it is essential that the Product Manager 
take the pulse of the company, propose solutions, and mediate to 
get everyone going with Agile. In fact, as described in The Guide to 
Wireframing, it’s not a bad idea to learn some basic design skills — 


especially if you aren’t a designer. 


Even the roughest wireframe can explain a concept to designers 
better than the most detailed specs document. More importantly, 
wifeframes and lo-fi prototypes serve as a collaborative rallying point 


for the whole team (regardless of who first created them). 


3. Always prototype 


Once you’re finished with the design studio exercise we discussed 
in the last section, the design team can flesh out the best ideas into 


a prototype for quick user validation. 


If you’re using a tool like UXPin, you can create a flat wireframe, then 
add some interactions to quickly create a lo-fi prototype. Once you’ve 
gathered team feedback and tested the lo-fi prototype with at least 
5 users, you can move to Photoshop or Sketch to improve the visual 
design. When you’re satisfied, import the file back into UXPin to add 
interactions to any layer. Test the hi-fi prototype you just created, 


iterate based on results, and repeat as much as needed. 
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During each step of the process from sketch to hi-fi prototype, make 


sure you get feedback from stakeholders and developers. 


Developers are not code monkeys, so don’t hand them a prototype 
and expect it to be perfectly feasible. Developers speak the language 
of interaction (between elements, between systems, etc.), so start 


bouncing ideas around with them as early as possible. 


4. If UX resources are overwhelmed, go for 
“bare bones” design 


Several years ago, I worked on an Agile project that was scheduled 
to run for about six months. For the first two months of the project, I 
wasn’t able to secure any UX resources because the design team was 


already playing catchup on other projects. 


Rather than delay the development of my project, we agreed that I 
would provide the development team with basic wireframes. Every 
two weeks we successfully completed and demo’d our work. The UI 
was something out of a kindergarten project: plain white, background, 
simple drop down menus, all text aligned to the left. But it did its job 


of communicating the content structure and overall concepts. 
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A couple of months into the project, a UX resource was freed up to 


add fidelity to these screens and polish the visual design. 


Surprisingly, this process actually worked very well for the project. 
By following a bare bones approach for the first two months, the 
development team was able to focus on first setting up the backend 
framework correctly. That ensured that information could be re- 
trieved, manipulated and displayed correctly before anyone started 


feeling attached to pixel-perfect ideas. 


Functionally, we were able to achieve a lot in those first two months 
and then dedicate time later to ensuring that the front end was top 


notch. 


5. Include a front-end gatekeeper in the 
development team 


I have experienced first-hand what happens to a project when there 
is a front-end dev with a strong design sensibility and when there is 


one without it. 
In terms of the final design, the difference is as stark as night and day. 


Every Agile product team needs to invest in a strong front-end dev 
who will make sure that everything is pixel perfect. Trust me, it will 
save you a lot of grief during testing. For anyone who has tested 
screens with misaligned icons, incorrect spacing, wrong font, etc., I 
think you will agree that correcting these details can sometimes take 


a surprisingly long time. 


A strong front-end dev will not only be the gatekeeper of the UX de- 
signer’s work, but they will also end up being the UX designer’s best 
sanity check on the technical side. This is the person who will not 
simply implement the design they’ve been given but will suggest a 


better way of doing it if one Is available. Priceless. 


When deciding which member of the development team should serve 
as the front-end gatekeeper, the Product Manager and UX Designer 


should keep the following in mind: 


¢ If the Product Manager is very familiar with all the developers 
in the Scrum team, then he or she can let the Scrum Master (the 
person facilitating the Agile process, e.g. a Project Manager) know 


who would best serve as gatekeeper. 


¢ During the first sprint planning session, the Product Manager or 
Scrum Master should inform the entire team that there is a des- 


ignated front-end gatekeeper. 


¢ Clarify to the team that the gatekeeper will help avoid double 
work(no one wants that!). The team should understand that the 
gatekeeper will speed things up, so if they get stuck, they have 
someone to lean on for help. By presenting it this way, developers 
can feel that they’re still in an autonomous position, and that they 
have the freedom to go to the gatekeeper (or to the UX Designer) 


as needed. 


As you’ve noticed above, I indicate working with the Scrum Master 


every step of the way. 


A strong and reliable Scrum Master is the equivalent of the Product 
Manager for the technical team members. It’s important that the 
developers don’t get the impression that the Product Manager or UX 
Designer is imposing a particular work style. And since the Scrum 
Master has to follow up on the allocation of resources each day, it’s 


essential that this person also feel that their expertise matters. 


Testing & Validation 


In the Agile process, testing occurs throughout each sprint, each time 
a new build is available. Generally speaking, a new build is made 
available each day for the QA team and Product Manager to verify. 


A few things to keep in mind regarding testing: 


1. Always make time for personal UX walkthroughs 


The UX designer should make time during each sprint to walk through 
the overall design and experience to ensure that it matches their 


original designs. 


Note that this is not usability or user testing, but rather personal 
verification to ensure that everything from font type and font size to 
image and text alignment is implemented exactly as required. While 
the Product Manager can certainly perform this task (I’ve done so 
many times in the past) the fact is few Product Managers will notice 
the level of detail that a UX Designer will. 
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A GUIDE TO DISCERNIBLE WEB DESIGN 


They say a good designer is a meticulous one. 
“Sweat the details” and all of that. But how well 
does that ethos check out when we're passing along 


PSDs? 
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It is also worth pointing out that this test doesn’t need to occur every 
day with every new build delivered by the development team. De- 
pending on the type of project and the features being implemented 
in a given sprint, the product manager and UX designer should agree 


on when UX testing makes sense. 


In a two-week sprint, for example, the UX designer can conduct a 
walkthrough at the end of the first week and again at the end of the 
second week. For sprints with more UI-intense features, it may be 


necessary to check on the UX every few days. 


2. Don’t forget about Acceptance Testing 


Once a project is completed, it is again worthwhile having the UX 
designer go through the entire workflow to make sure that the en- 
tire workflow does indeed work and that each screen follows the 


intended style guide. 


To carry out some quick acceptance tests, follow the core user flows 
(e.g. create an account, start new project, and add teammates) and 
take note of any friction points and visual inconsistencies. Any lags 
in the experience may be due to design flaws or performance issues 


on the back-end (both of which require further investigation). 
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While we’ve described internal tests above, you must also run us- 


ability tests with at least 5 users. Since usability testing is too broad 


to cover in this guide, we recommend checking out the free Guide to 
Usability Testing for a 100+ page explanation of 30+ usability tests 


that all work well in the Agile process. 


Product Launch 


Releasing a product out into the market kicks off a new phase of UX 
testing. One can think of this as more of a “UX monitoring” phase as 
feedback from users, the industry, partners, and other teams s starts 


to trickle in. 


A few things to keep in mind after a product launch: 


1. All feedback is valuable 


While direct user feedback is invaluable for constant product improve- 
ment, feedback from account managers, sales managers, support staff 
and community managers is just as valuable. These individuals are 
in constant contact with end users and they all have great insights 
into what users are seeking and why. It is extremely helpful for the 
Product Manager and UX Designer to connect regularly with these 
individuals to funnel information into the backlog for future product 


enhancements. 
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So what sort of information and insights can other team members 


provide? 


1. Industry-specific needs 
Account and sales managers can explain in great detail the needs 
of different industries. A previous employer fielded account man- 
agement teams organized according to industry: Advertising & 
Media, Construction, Government, etc. By talking to the leads for 
each business unit, I was able to understand the workflows and 
functionalities that each industry required. This information then 
informed future product development with stakeholders, and 
some cases, this information led to the creation of entirely new 


products geared toward one industry. 


2. Competitor information 
Account and sales managers can also provide insights into real 
and fake competitors on the market. Real competitors are the ones 
whose product offerings, target audience and positioning are very 
much aligned with yours. The fake competitors, however, are the 


companies that have inadvertently moved into your market space. 


Typically fake competitors have not invested any time or effort into 
entering your market space. Instead it’s the user that has stumbled 
onto their product and found a way to adapt it to their needs. A 
strong understanding of the fake competitors teaches you a lot 


about your target user’s workrarounds and what they truly need. 


3. Bug statistics 
The Customer Support team can help take the guesswork out of 
the bug and new feature prioritization process. By analyzing 
tickets from a specific time period, for example, one can identify 
the functional areas that generate a lot of questions from users or 


cause frustration for users. 


4. User categories 
Just like account managers, support teams can also provide in- 
sights into the needs of specific user types. This is particularly 
helpful when your product has a wide user base that covers 
several demographics or user types (professionals/businesses vs. 
regular consumer). The support team manages requests from all 
these user types, which means they can usually provide data for 


requested functionalities. 


2. Keep personas and user journeys updated 


Every new product release or product enhancement is an opportu- 


nity to acquire new users and move existing users further along the 


customer lifecycle 


It’s a good idea to monitor user feedback from all sources (social 
media, customer support, account managers and sales managers) to 


see the conversations happening about your product. 


With regards to new users, check to see if they fit into existing persona 
categories and if not, then create new personas that reflect updated 


user needs. 
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With new features come new workflows and ways of using your prod- 
uct. Before you launch new features, make sure you create events 


in your product analytics tool so you can monitor feature usage and 


flows. 


The UXPin product team, for example, creates events in KISSMetrics 
for every single product function. Based on how users trigger the 
events, the UX designers can periodically review and update existing 
user flows. Once they also factor in the feedback from customer-facing 
teams like Sales and Customer Support, the team now has quantita- 
tive insights (usage metrics) and qualitative insights (user feedback) 


to steer the product roadmap in the right direction. 


Remember that no solution is really ever final. It’s only the solution 
for now. Once it gets in the wild, things will naturally evolve and 


change, as will your users’ needs. 


Takeaway 


As stated at the beginning of this guide, each organization that choos- 
es to implement Agile has to do so in the manner that fits the overall 


company culture. 


The goal is not to implement a system that is rigid and process-heavy. 
The same goes for integrating UX into Agile. It will depend on the 
resources available, time, budget, and the team’s level of maturity 


with Agile. 


However, success can be achieved when the focus is aligned with 
core Agile principles of collaboration, iteration, self-organization, 
and empathy for users. Let the Agile spirit drive your UX processes 


and you’ll find that the implementation will fall into place naturally. 


UXPin 


ENTERPRISE 


(Vv) Create and Collaborate. 
Translate requirements into product features 
that resonate with customers. 


Simplify your Process. 
Centralize projects and people into one clear workflow. 


Empower your Team. 
Guide creativity with a common design language. 
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